<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>to-do-list by vue</title>
    <script src="./vue-2.5.13.js"></script>
</head>
<body>
<div id="app">
    <div>
        <input v-model="title">
        <button v-on:click="add">submit</button>
    </div>
    <div>
        <ul>
            <li v-for="item in list">{{item}}</li>
        </ul>
    </div>
</div>

<script type="text/javascript">
    // data 独立
    var data = {
        title: '',
        list: []
    }
    // 初始化 Vue 实例
    var vm = new Vue({
        el: '#app',
        data: data,
        methods: {
            add: function () {
                this.list.push(this.title)
                this.title = ''
            }
        }
    })

    /*

    with(this){  // this 就是 vm
        return _c(
            'div',
            {
                attrs:{"id":"app"}
            },
            [
                _c(
                    'div',
                    [
                        _c(
                            'input',
                            {
                                directives:[
                                    {
                                        name:"model",
                                        rawName:"v-model",
                                        value:(title),
                                        expression:"title"
                                    }
                                ],
                                domProps:{
                                    "value":(title)
                                },
                                on:{
                                    "input":function($event){
                                        if($event.target.composing)return;
                                        title=$event.target.value
                                    }
                                }
                            }
                        ),
                        _v(" "),
                        _c(
                            'button',
                            {
                                on:{
                                    "click":add
                                }
                            },
                            [_v("submit")]
                        )
                    ]
                ),
                _v(" "),
                _c('div',
                    [
                        _c(
                            'ul',
                            _l((list),function(item){return _c('li',[_v(_s(item))])})
                        )
                    ]
                )
            ]
        )
    }

    */
</script>
</body>
</html>